<!DOCTYPE HTML>
<html>
 <head>
  <meta charset="UTF-8"/>
  <title> New Document </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <link href="style.css" type="text/css" rel="stylesheet" />
 </head>

 <body>
	<div id="effect">
		<ul>
			<li><a href="#" title="pic1title"><img src="1.jpg" alt="pic1"  /></a></li>
			<li><a href="#" title="pic2title"><img src="2.jpg" alt="pic2" /></a></li>
			<li><a href="#" title="pic3title"><img src="3.jpg" alt="pic3" /></a></li>
			<li><a href="#" title="pic4title"><img src="4.jpg" alt="pic4" /></a></li>
		</ul>       
	</div>
	<div id="effect1">
		<ul>
			<li><a href="#" title="pic1title"><img src="1.jpg" alt="pic1"  /></a></li>
			<li><a href="#" title="pic2title"><img src="2.jpg" alt="pic2" /></a></li>
			<li><a href="#" title="pic3title"><img src="3.jpg" alt="pic3" /></a></li>
			<li><a href="#" title="pic4title"><img src="4.jpg" alt="pic4" /></a></li>
		</ul>
        
	</div>
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
	<script src="base.js"></script>
	<script >
		$(document).ready(function(){			
			$("#effect ul").fadeInOut({'nextLabel':'Next', 'prevLabel': 'Previous'});
			$("#effect1 ul").fadeInOut({nextControl: '#nextButton1', prevControl: '#prevButton1',pageControl:'.pageControl1',delay:2000});
		});
	</script>
 </body>
</html>
